<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Reset Password</title>
  </head>
  <body
    style="
      background-color: #f8f9fb;
      height: 100%;
      font-family: Arial, Helvetica, sans-serif;
    "
  >
    <div
      style="
        width: 100%;
        margin: auto;
        text-align: center;
        background-color: #f8f9fb;
      "
    >
      <table style="text-align: center; width: 100%">
        <tr>
          <td style="height: 6px"></td>
        </tr>
        <tr>
          <td style="text-align: center">
            <table
              style="
                background-color: #ffffff;
                text-align: center;
                max-width: 55%;
                margin: auto;
              "
            >
              <tr>
                <td style="height: 20px"></td>
              </tr>
              <tr>
                <td>
                  <table style="width: 100%">
                    <tr>
                      <td style="text-align: center">
                        <img
                          src="https://app.hyperswitch.io/email-assets/HyperswitchLogo.png"
                          alt="Hyperswitch"
                          style="
                            text-align: center;
                            height: 1.3rem;
                            width: auto;
                          "
                        />
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
              <tr>
                <td style="height: 40px"></td>
              </tr>
              <tr>
                <td
                  style="
                    font-size: 2.02rem;
                    font-weight: 600;
                    line-height: 2.5rem;
                    color: #111326;
                    min-width: 550px;
                  "
                >
                  Reset password!
                </td>
              </tr>
              <tr>
                <td style="height: 10px"></td>
              </tr>
              <tr>
                <td
                  style="
                    color: #666666;
                    width: 50%;
                    font-size: 1.02rem;
                    font-weight: 400;
                    line-height: 1.4rem;
                    min-width: 300px;
                  "
                >
                  <table
                    style="
                      width: 50%;
                      min-width: 450px;
                      text-align: center;
                      margin: auto;
                    "
                  >
                    <tr>
                      <td>
                        We have received a request to reset your password
                        associated with
                        <span style="font-weight: bold"> username : </span>
                        {username}
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
              <tr>
                <td style="height: 10px"></td>
              </tr>
              <tr>
                <td
                  style="
                    color: #666666;
                    width: 50%;
                    font-size: 1.02rem;
                    font-weight: 400;
                    line-height: 1.4rem;
                    min-width: 300px;
                  "
                >
                  <table
                    style="
                      width: 50%;
                      min-width: 370px;
                      text-align: center;
                      margin: auto;
                    "
                  >
                    <tr>
                      <td>Click on the below button to reset your password.</td>
                    </tr>
                  </table>
                </td>
              </tr>
              <tr>
                <td style="height: 30px"></td>
              </tr>
              <tr>
                <td>
                  <a
                    href="{link}"
                    style="
                      text-decoration: none;
                      border: none;
                      border-radius: 64px;
                      font-size: 1.03rem;
                      color: #ffffff;
                      font-weight: 500;
                      line-height: 1.5rem;
                      width: 50%;
                      padding: 0.9rem 4rem;
                      background: #0070ff;
                      min-width: 18rem;
                      max-width: 25rem;
                      cursor: pointer;
                    "
                  >
                    Reset Password
                  </a>
                </td>
              </tr>
              <tr>
                <td style="height: 70px"></td>
              </tr>
              <tr>
                <td
                  style="
                    font-size: 12px;
                    line-height: 1rem;
                    font-weight: 400;
                    color: #111326b2;
                  "
                >
                  Follow us on
                </td>
              </tr>
              <tr>
                <td style="font-size: 0">
                  <a
                    href="https://github.com/juspay/hyperswitch"
                    target="_blank"
                  >
                    <img
                      src="https://app.hyperswitch.io/email-assets/Github.png"
                      alt="Github"
                      height="15"
                    />
                  </a>
                  <a
                    href="https://x.com/hyperswitchio?s=21"
                    target="_blank"
                    style="margin: 0 6px 0"
                  >
                    <img
                      src="https://app.hyperswitch.io/email-assets/Twitter.png"
                      alt="Twitter"
                      height="15"
                    />
                  </a>
                  <a
                    href="https://www.linkedin.com/company/hyperswitch/"
                    target="_blank"
                  >
                    <img
                      src="https://app.hyperswitch.io/email-assets/Linkedin-Dark.png"
                      alt="LinkedIn"
                      height="15"
                    />
                  </a>
                </td>
              </tr>
              <tr>
                <td style="height: 20px"></td>
              </tr>
            </table>
          </td>
        </tr>
        <tr>
          <td style="height: 6px"></td>
        </tr>
      </table>
    </div>
  </body>
</html>
